@import '~@/styles/variables.scss';
// cover some element-ui styles

body {
  .el-breadcrumb__inner,
  .el-breadcrumb__inner a {
    font-weight: 400 !important;
  }

  .el-upload {
    input[type="file"] {
      display: none !important;
    }
  }

  .el-upload__input {
    display: none;
  }

  // to fixed https://github.com/ElemeFE/element/issues/2461
  .el-dialog {
    transform: none;
    left: 0;
    position: relative;
    margin: 0 auto;
  }

  // refine element ui upload
  .upload-container {
    .el-upload {
      width: 100%;

      .el-upload-dragger {
        width: 100%;
        height: 200px;
      }
    }
  }

  // dropdown
  .el-dropdown-menu {
    a {
      display: block;
    }
  }

  // el-select
  .el-date-editor.el-input,
  .el-date-editor.el-range-editor.el-input__inner.el-date-editor--daterange,
  .el-select {
    width: 100%;

    .el-range-separator {
      width: unset;
    }
  }

  .list-slide__nav {
    .el-tabs__nav-scroll {
      padding-left: 20px;
    }
  }

  // button
  .el-button--small,
  .el-button--small.is-round {
    padding: 7px 15px;
  }

  .amap-marker-content {
    font-size: 12px;
  }

  .el-input,
  .el-table,
  .el-tree-node__label,
  .el-form-item__label,
  .el-checkbox__label,
  .el-form-item__content,
  .el-range-input,
  .el-range-separator {
    font-size: 12px !important;
  }

  .el-checkbox {
    margin-right: 20px;
  }

  .list-query-page {
    .el-date-editor.el-range-editor.el-input__inner.el-date-editor--daterange {
      width: unset;
    }
  }

  // 多级表头(el-table--group)的表格修改border属性没有效果
  .el-table--group {
    th {
      border-right: none !important;
      border-bottom: none !important;
    }

    td {
      border-right: none !important;
    }

    border: none !important;
  }

  .el-table .cell {
    text-align: center;
  }

  .el-table__header {
    th {
      background-color: #fafafa;
      color: #333;
    }

    tr {
      background-color: #fafafa;
    }
  }

  .el-button--text {
    &.el-button {
      padding-top: 8px;
      padding-bottom: 8px;
    }
  }

  //按钮覆盖element-UI
  .el-input__inner {
    height: 32px;
    line-height: 32px;
  }

  .el-date-editor.el-input {
    .el-input__icon {
      line-height: 32px;
    }
  }

  .el-date-editor {
    .el-range-separator {
      line-height: 24px;
    }

    .el-range__icon {
      line-height: 24px;
    }
  }

  .el-button--medium {
    padding: 8px 10px;
  }

  .el-input__icon {
    line-height: 32px;
  }

  .el-cascader {
    line-height: 32px;

    .el-input__inner {
      height: 32px !important;
    }
  }
  //el-menu
  .el-menu--horizontal > .el-menu-item.is-active {
    font-weight: bold;
  }

  // 隐藏el-scrollbar的横向滚动条
  .el-scrollbar__wrap {
    overflow-x: hidden;
  }
  // filter 不应用hidden
  .el-table-filter__wrap.el-scrollbar__wrap {
    overflow-x: scroll;
  }

  // 解决上面 overflow-x: hidden; 导致checkbox的问题
  .el-select-dropdown__wrap.el-scrollbar__wrap {
    overflow-x: scroll;
  }
  // 有时间刻度的date-picker隐藏清除按钮
  .el-date-range-picker {
    .el-button--text {
      display: none !important;
    }
  }

  .el-badge__content {
    border: none;
  }

  .el-image-viewer__btn {
    .el-icon-circle-close {
      color: #fff;
    }
  }
}

// el-table 加悬浮x轴滚动特效的指令class覆盖样式
.ps__rail-x {
  display: block;
  z-index: 99; /* 大于fixed table 的z-index */
}
